For full control over the HTML structure of a shared page — beyond what
custom CSS, JS, or HTML snippets allow — you can replace the page template
entirely using the ~shareTemplate relation.
To do so:
~shareTemplaterelation pointing to the note created at step (1).
Make use of Attribute Inheritance to
apply it to multiple shared notes.There are two important constraints to be aware of:
~shareTemplate only
takes effect when backend scripting is enabled. If it is disabled (see
Security), the relation is ignored and the default template is used.
For the same reason, only apply templates from notes you trust.~shareCss,
~shareJs) in order for it to be loaded. To prevent it from being
shown in the navigation, apply #shareHiddenFromTree to
it.Use the original template as reference when creating a new share template.
Your template is rendered with a context object exposing the note and its rendering environment. The most useful values are:
| Variable | Description |
|---|---|
note
|
The note being rendered. Use it to read attributes (note.getLabelValue(...)),
note.title, child notes, etc. |
content
|
The note's already-rendered HTML content, as a string. |
header
|
Extra HTML to place in the document head for this note (used by some note types). |
isEmpty
|
true when the note has no content of its
own. |
subRoot
|
The root of the shared subtree as { note, branch } —
handy for a site-wide title or logo. |
cssToLoad / jsToLoad
|
Arrays of stylesheet / script URLs the default theme would inject (includes
anything added via ~shareCss / ~shareJs). |
faviconUrl / logoUrl
|
Resolved favicon and logo URLs. |
isStatic
|
true during a static HTML export,
falsefor a live server render. |
t
|
The i18next translation function. |
utils
|
Helper utilities such as slugify() and
stripTags(). |
If your template throws an error while rendering, Trilium logs the error and quietly falls back to the default template, so a broken template never takes the shared page down.
A template can pull in other EJS notes as partials. Create them as child notes of
the template note (each also a code /
application/x-ejsnote) and reference them by title:
<%- include("header") %>
<main>
<h1><%= note.title %></h1>
<%- content %>
</main>
<%- include("footer") %>
Here header and footer are
the titles of child notes of the template. Only direct children are resolvable,
and they must be EJS code notes.